import React from 'react'

import '../css/finish.css'
import eventEmitter from '../event'

class Finish extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            list: []
        }
        this.change = (item, index) => {
            item.status=0
            eventEmitter.emit('sendToWork',item)

            this.state.list.splice(index,1)
            this.setState({
                list:this.state.list
            })
        }
        this.del=(item,index)=>{
            this.state.list.splice(index,1)
            this.setState({
                list:this.state.list
            })
        }
    }
    componentDidMount() {
        eventEmitter.addListener('sendToFinish', (obj) => {
            this.state.list.push(obj)
            this.setState({
                list: this.state.list
            })
        })
    }
    render() {
        return (
            <div className='finish'>
                <h1><b>已经完成</b><span>0</span></h1>
                <ul>
                    {
                        this.state.list.map((item, index) => {
                            if (item.status == 1) {
                                return <li key={index}>
                                    <input type="checkbox" onChange={() => { this.change(item, index) }} checked />
                                    <p>{item.content}</p>
                                    <span onClick={()=>{this.del(item,index)}}>-</span>
                                </li>

                            }
                        })
                    }

                </ul>

            </div>
        )
    }
}

export default Finish;